import React, { Component } from 'react';
import './Grid.style.scss'
import FooterBar from 'views/home/index/recommend/FooterBar'

class Grid extends Component {
    render() {
        return (
            <div className="grid">
                {
                    this.props.data&&this.props.data.map((item,index)=>{
                        return (
                            <div className="content" key={index}>
                                <img src={item.title_img} alt=""/>
                                {
                                    item.products.map((val,index)=>{
                                        return (
                                            <div className="item" key={index}>
                                                <img src={val.img} alt=""/>
                                                <h3>{val.title}</h3>
                                                <span>￥{val.price}</span>
                                                <em>{val.gifttitle}</em>
                                            </div>
                                        )
                                    })
                                }
                            </div>
                        )
                    })
                }
                <img src="https://oss.flowerplus.cn/oss_png/2020-02-26/15827043142356.png!750" alt=""/>
                {
                    this.props.category&&this.props.category.map((item,index)=>{
                        return (()=>{
                            if(this.props.index!==index){
                                return (
                                    <div className="cateimgs" key={index}>
                                        <img src={item.subtitle_img} alt=""/>
                                    </div>
                                )
                            }
                        })()
                    })
                }
                <FooterBar></FooterBar>
            </div>
        );
    }
}

export default Grid;